<template>
    <div>
        <el-dialog
            :title="title"
            :close-on-click-modal="false"
            v-dialogDrag
            :visible.sync="editVisible"
        >
            <el-form
                v-loading="loading"
                label-width="105px"
                ref="editForm"
                :model="editForm">

                <el-form-item label="转出客户:" prop="companyName" :rules="[
                  {required: true, message:'转出客户不能为空', trigger:['change','blur']}
                 ]">
                    <el-autocomplete placeholder="请输入内容" size="small"
                                     @blur.stop="saveLocal($event.target.value,'userName')" :debounce="0"
                                     :fetch-suggestions="querySearch" @select="handleSelect($event,'1')"
                                     :trigger-on-focus="false" v-model="editForm.companyName">
                        <template slot-scope="{ item }">

                            <section class="querySearch-autocomplete">
                                <section class="name-item">
                                    <section class="name"><span v-if="item.value">{{ item.value.substr(0, 1) }}</span>
                                    </section>
                                    {{ item.value }}
                                    ({{ item.contactPhone }})
                                </section>
                                <section>
                                </section>
                            </section>

                            <div></div>
                            <!-- <span class="addr">{{ item.address }}</span> -->
                        </template>
                    </el-autocomplete>
                </el-form-item>
                <el-form-item label="转出账户:"  prop="companyAccountId" :rules="[
                              {required: true, message:'请选择转出账户', trigger:'blur'}
                             ]">
                    <el-select clearable :disabled="editForm.companyId===''" v-model="editForm.companyAccountId" placeholder="请选择账户" >
                        <el-option
                            v-for="item in selectData"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                        </el-option>
                    </el-select>
                </el-form-item>


                <el-form-item label="转入客户:" prop="toCompanyName" :rules="[
                  {required: true, message:'转入客户不能为空', trigger:['change','blur']}
                 ]">
                    <el-autocomplete placeholder="请输入内容" size="small"
                                     @blur.stop="saveLocal($event.target.value,'userName')" :debounce="0"
                                     :fetch-suggestions="querySearch" @select="toHandleSelect($event,'1')"
                                     :trigger-on-focus="false" v-model="editForm.toCompanyName">
                        <template slot-scope="{ item }">

                            <section class="querySearch-autocomplete">
                                <section class="name-item">
                                    <section class="name"><span v-if="item.value">{{ item.value.substr(0, 1) }}</span>
                                    </section>
                                    {{ item.value }}
                                    ({{ item.contactPhone }})
                                </section>
                                <section>
                                </section>
                            </section>

                            <div></div>
                            <!-- <span class="addr">{{ item.address }}</span> -->
                        </template>
                    </el-autocomplete>
                </el-form-item>
                <el-form-item label="转入账户:"  prop="toCompanyAccountId" :rules="[
                              {required: true, message:'请选择转入账户', trigger:'blur'}
                             ]">
                    <el-select clearable :disabled="editForm.toCompanyId===''" v-model="editForm.toCompanyAccountId"  placeholder="请选择账户" >
                        <el-option
                            v-for="item in selectData"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                        </el-option>
                    </el-select>
                </el-form-item>

                <el-form-item label="调账金额:" prop="activityMoneyUsed" :rules="[
                              {required: true, message:'请输入调账金额', trigger:'blur'},
                              {validator: validator.isIntGteZero, trigger:'blur'},
                              {validator: isIntLteMoney, trigger:'blur'}
                             ]">
                    <el-input v-model="editForm.activityMoneyUsed" v-thousands.activityMoneyUsed="editForm">
                        <template slot="append">元</template>
                    </el-input>
                </el-form-item>

            </el-form>
            <span slot="footer" class="dialog-footer">
        <div class="footer-input">
          <el-button size="small" type="primary" @click="doSubmit()" v-noMoreClick
          >确定</el-button
          >
        <el-button size="small" @click="close()">取消</el-button>

        </div>

      </span>
        </el-dialog>
    </div>
</template>
<script>
    import {save,getById} from '@/api/finance/FinanceReceive.js';
    import {isIntLteMoney} from '@/api/finance/FinanceCompanyAccount.js';
    import {getSearchlist, getAccountSelectList} from '@/api/market/crm.js';

    export default {
        components: {},
        data() {
            return {
                loading: false,
                areaLabel: {},
                outMoney: '',
                selectData: [],
                pickerOptionsStart:{
                    disabledDate:(time)=>{
                        if(this.editForm.endTime) {
                            return time.getTime() < Date.now()-8.64e7 || time.getTime() > new Date(this.editForm.endTime).getTime() - 1*24*60*60*1000;
                        }
                        return time.getTime() < Date.now()-8.64e7;
                    }
                },
                pickerOptionsEnd:{
                    disabledDate:(time)=>{
                        return time.getTime() < Date.now()-8.64e7 || time.getTime() < new Date(this.editForm.effectTime).getTime() + 1*24*60*60*1000;

                    }
                },
                method: '',
                title: '',
                editForm: {
                    id: '',
                    accountDealType: 5,
                    companyId: '',
                    companyName: '',
                    companyAccountId: '',
                    businessId: '',
                    toCompanyId: '',
                    toCompanyName: '',
                    toCompanyAccountId: '',
                    noticeMoney: '',
                    activityMoneyUsed: '',
                    actualMoney: '',
                    ratio: 1,
                    notificationCode: '',
                    noticePeopleId: '',
                    noticePeople: '',
                    noticeTime: '',
                    receivePeopleId: '',
                    receivePeople: '',
                    receiveTime: '',
                    state: ''
                },
                editVisible: false,
                detailsVisible: false,
                tableData1: [],
                page: {
                    pageSize: 10,
                    pageNo: 1,
                    total: 0
                },
                props: 1,
                dialogVisible: false,
                query: ''
            }
        },
        methods: {
        	handleClose(done) {
						this.$Msg.confirm({
							title:'您确定要关闭吗？',
							content:this.GLOBAL.FORM_CLOSE_TIPS,
							confirmCall:()=>{
								done();
							}
						})
					},
            // 校验转出金额是小于等于余额
            isIntLteMoney (rule, value, callback) {
                if (value) {
                    isIntLteMoney({
                        id: this.editForm.companyAccountId,
                        money: value
                    }).then(res => {
                        console.log(res.data)
                        if (!res.data.result) {
                            callback(new Error('余额不足！'))
                        } else {
                            callback()
                        }
                    })
                } else {
                    callback()
                }
            },
            // 根据客户获取账户信息
            getAccountSelectList (companyId) {
                this.loading = true
                getAccountSelectList({
                    id: companyId
                }).then((res) => {
                    if (res.data.code === '200') {
                        this.selectData = res.data.result
                        this.loading = false;
                    }
                })
            },
            saveLocal(val, filed) {
                // let val2={value:''}
                // val2.value=val
                // this.values.push(val2)
                // this.Es5duplicate(this.values,'value')
            },
            // 匹配输入建议
            querySearch(queryString, cb) {
                if (queryString) {
                    getSearchlist({
                        selectValue: queryString,
                        state: 1
                    }).then((res) => {
                        console.log(res)
                        if (res.data.code === '200') {

                            this.values = []
                            for (let index = 0; index < res.data.result.length; index++) {
                                let element = {
                                    id: '',
                                    value: '',
                                    contactPhone: '',
                                    idCard: ''
                                }
                                element.id = res.data.result[index].id
                                element.value = res.data.result[index].names
                                element.contactPhone = res.data.result[index].contactPhone
                                element.idCard = res.data.result[index].idCard
                                this.values.push(element);
                            }
                            cb(this.values)
                        }
                    })
                }
                // 调用 callback 返回建议列表的数据
            },
            handleSelect($event, item) {
                console.log($event)
                this.editForm.companyId = $event.id
                this.editForm.companyName = $event.value
                this.getAccountSelectList(this.editForm.companyId);
            },
            toHandleSelect($event, item) {
                console.log($event)
                this.editForm.toCompanyId = $event.id
                this.editForm.toCompanyName = $event.value
                console.log(this.editForm.toCompanyName)
                this.getAccountSelectList(this.editForm.toCompanyId);
            },
            select(e) {
                console.log(e);
                this.editForm.companyName = e.names
                this.editForm.companyId = e.id
                this.dialogVisible = false
                console.log(e)
            },
            toSelect(e) {
                console.log(e);
                this.editForm.toCompanyName = e.names
                this.editForm.toCompanyId = e.id
                this.dialogVisible = false
                console.log(e)
            },
            init(method, obj) {
                if (method === 'add') {
                    this.editVisible = true
                    this.editForm.id = ''
                    this.editForm.accountDealType = ''
                    this.editForm.companyId = ''
                    this.editForm.companyName = ''
                    this.editForm.companyAccountId = ''
                    this.editForm.businessId = ''
                    this.editForm.toCompanyId = ''
                    this.editForm.toCompanyName = ''
                    this.editForm.toCompanyAccountId = ''
                    this.editForm.noticeMoney = ''
                    this.editForm.activityMoneyUsed = ''
                    this.editForm.actualMoney = ''
                    this.editForm.ratio = ''
                    this.editForm.notificationCode = ''
                    this.editForm.noticePeople = ''
                    this.editForm.noticeTime = ''
                    this.editForm.receivePeople = ''
                    this.editForm.receiveTime = ''
                    this.editForm.notificationCode = ''
                    this.editForm.noticePeopleId = ''
                    this.editForm.noticePeople = ''
                    this.editForm.noticeTime = ''
                    this.editForm.receivePeopleId = ''
                    this.editForm.receivePeople = ''
                    this.editForm.receiveTime = ''
                    this.editForm.state = ''
                    this.title = '新增123'
                    this.visible = true
                    this.loading = false
                } else if (method === 'edit') {
                    this.editVisible = true
                    this.method = method
                    this.title = '修改'
                    console.log(obj.id)
                    this.$set(this.editForm, 'id', obj.id);
                    this.$nextTick(() => {
                        this.loading = true
                        if (method === 'edit' || method === 'view') { // 修改或者查看
                            getById({id: this.editForm.id}).then((res) => {
                                if (res.data.code === '200') {
                                    this.editForm = res.data.result
                                    this.selectData = res.data.result.selectVos
                                    this.loading = false
                                } else {

                                    this.visible = false
                                    this.$message({
                                        type: 'error',
                                        message: res.data.message
                                    })
                                }
                            })
                        }
                    })
                    this.visible = true
                    this.loading = false
                }

            },
            close() {
                this.editVisible = false
            },
            doSubmit() {
                this.$refs['editForm'].validate((valid) => {
                    if (valid) {
                        this.$set(this.editForm, 'accountDealType', 7)
                        this.$set(this.editForm, 'ratio', 1)
                        save(this.editForm).then((res) => {
                            if (res.data.code === '200') {
                                this.$message({
                                    message: '编辑成功',
                                    type: 'success'
                                })
                                this.editVisible = false
                                this.$emit('refreshDataList')
                            }
                        })
                    }
                })
            }
        },
        mounted() {

        }
    }
</script>
<style lang="scss" scoped>
    ::v-deep .el-dialog {
        .el-form {
            .el-input__inner {
                width: 320px;
            }

            .inputAppend-wrapper {
                .el-input__inner {
                    width: 282px;
                }
            }
        }
    }
</style>
